<template>
    <div class="collageTeam">
        <div class="collageTitle">
            <span class="firstTitle">超值拼团</span>
            <span class="lastTitle">邀请好友一起来拼团</span>
            <span class="collageBtn">更多拼团</span>
        </div>
        <cube-scroll
                direction="horizontal"
                class="horizontal-scroll-list-wrap">
            <ul class="list-wrapper">
                <li class="list-item">
                    <div class="listItem">
                        <img src="../../assets/collage/collage1.png"/>
                        <div class="price">
                            <span class="firstPrice">2人拼</span>
                            <span class="rmb">￥</span>
                            <span class="num">248</span>
                        </div>
                        <div class="oldPrice">￥249.00</div>
                    </div>
                </li>
                <li class="list-item">
                    <div class="listItem">
                        <img src="../../assets/collage/collage1.png"/>
                        <div class="price">
                            <span class="firstPrice">2人拼</span>
                            <span class="rmb">￥</span>
                            <span class="num">248</span>
                        </div>
                        <div class="oldPrice">￥249.00</div>
                    </div>
                </li>
                <li class="list-item">
                    <div class="listItem">
                        <img src="../../assets/collage/collage1.png"/>
                        <div class="price">
                            <span class="firstPrice">2人拼</span>
                            <span class="rmb">￥</span>
                            <span class="num">248</span>
                        </div>
                        <div class="oldPrice">￥249.00</div>
                    </div>
                </li>
                <li class="list-item">
                    <div class="listItem">
                        <img src="../../assets/collage/collage1.png"/>
                        <div class="price">
                            <span class="firstPrice">2人拼</span>
                            <span class="rmb">￥</span>
                            <span class="num">248</span>
                        </div>
                        <div class="oldPrice">￥249.00</div>
                    </div>
                </li>
                <li class="list-item">
                    <div class="listItem">
                        <img src="../../assets/collage/collage1.png"/>
                        <div class="price">
                            <span class="firstPrice">2人拼</span>
                            <span class="rmb">￥</span>
                            <span class="num">248</span>
                        </div>
                        <div class="oldPrice">￥249.00</div>
                    </div>
                </li>
            </ul>
        </cube-scroll>
    </div>
</template>

<script>
    export default {
        name : "index"
    }
</script>

<style scoped lang="stylus">
.collageTeam
    margin 0.27rem 0.24rem
    background-color #fff
    height 4.88rem
    border-radius 0.13rem
    .collageTitle
        padding 0.33rem 0.16rem
        display flex
        justify-content space-between
        align-items center
        .firstTitle
            color #333333
            font-size 0.40rem
            font-weight bold
        .lastTitle
            margin-right 2.76rem
            color #999999
            font-style italic
            font-size 0.29rem
        .collageBtn
            font-size 0.27rem
            color #fff
            padding 0.15rem 0.21rem
            background-color #00A38F
            border-radius 0.30rem
    .horizontal-scroll-list-wrap
        padding 0 0.27rem
        /*height 3.07rem*/
        /deep/.cube-scroll-content
            /*height 3.07rem*/
            display: inline-block
        .list-wrapper
            /*height 3.07rem*/
            /*padding: 0 10px*/
            /*line-height: 60px*/
            white-space: nowrap
        .list-item
            font-size 0.35rem
            /*height 3.07rem*/
            display: inline-block
            margin-right 0.13rem
            img
                width 2.40rem
                height 2.40rem
            .price
                color #00A38F
                width 2.40rem
                display flex
                justify-content center
                align-items flex-end
                padding-bottom 0.13rem
                .firstPrice
                    font-size 0.21rem
                .rmb
                    font-size 0.29rem
                .num
                    font-size 0.37rem
            .oldPrice
                /*margin-top 0.23rem*/
                text-decoration line-through
                color #999999
                font-size 0.21rem
                display flex
                justify-content center




</style>